import {
    useDispatch
} from "react-redux";
import React, {
    useState,
    useEffect,
    useCallback
} from "react";
import "./index.scss";

function Index(props) {
    let {
        data,
        visible
    } = props;
    const dispatch = useDispatch();
    data = data? data: {};
    const closePreview = () => {
        dispatch({
            type: "SET_PREVIEW_MODAL",
            data: false
        })
    }
    return (
        <div className="preview-image-container" style={{
            display: visible? "block": "none"
        }}>
            <iframe
            title="预览图片"
            src={data.previewPath}
            className="preview-image-iframe"
            name="previewImage"
            />
            <i className="close-btn" onClick={closePreview}></i>
            <i className="prev-btn"></i>
            <i className="next-btn"></i>
        </div>
    )
}

export default Index;